@section('css')
 {{ HTML::style('assets/js/jwysiwyg/jquery.wysiwyg.css') }}
 {{ HTML::style('assets/css/admin.css') }}
@stop
@section('content')
<div class="am-cf am-padding">
   <div class="am-fl am-cf">
      <a href="{{URL::route('product')}}"><strong class="am-text-primary am-text-lg">商品</strong></a> / <small>{{$product->name}}</small>
   </div>
</div>
  <!-- tab start -->
  <div id="product-tab" class="am-tabs am-margin" data-am-tabs="{noSwipe: 1}">
    <ul class="am-tabs-nav am-nav am-nav-tabs">
      <li class="am-active"><a href="#tab1">基本信息</a></li>
      <li><a href="#tab2">详细描述</a></li>
      <li><a href="#tab3">图片</a></li>
      <li><a href="#tab4">尺寸</a></li>
      <li><a href="#tab5">颜色</a></li>
    </ul>

    <div class="am-tabs-bd">
      <!-- base start -->
      <div class="am-tab-panel am-active" id="tab1">
        <form class="am-form am-form-horizontal" id="productBaseForm" data-id="{{$product->id}}"
        	name="productBaseForm" method="post" action="{{URL::route('product.add')}}">
        	<div class="am-form-group">
			    <label for="brand" class="am-u-sm-2 am-form-label">品牌</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="brand" name="brand" placeholder="输入品牌" value="{{$product->brand}}"
			      	data-rules="max_length[32]" class="validate" data-display="品牌">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			<div class="am-form-group">
			    <label for="name" class="am-u-sm-2 am-form-label">名称</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="name" name="name" placeholder="输入名称" value="{{$product->name}}"
			      	data-rules="required|max_length[32]" class="validate" data-display="名称">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 
			 <div class="am-form-group">
			    <label for="enname" class="am-u-sm-2 am-form-label">英文名</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="enname" name="enname" placeholder="输入英文名称" value="{{$product->enname}}"
			      	data-rules="max_length[64]" class="validate" data-display="英文名称">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 
			 <div class="am-form-group">
			    <label for="summary" class="am-u-sm-2 am-form-label">概述</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="summary" name="summary" placeholder="输入商品摘要" value="{{$product->summary}}"
			      	data-rules="max_length[128]" class="validate" data-display="商品摘要">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 
			 <div class="am-form-group">
			    <label for="category_id" class="am-u-sm-2 am-form-label">商品类别</label>
			    <div class="am-u-sm-5">
			      <select name="category_id">
			         @foreach ($categorys as $category)
			            <option value="{{$category->id}}"  {{$category->id == $product->category_id ? 'selected' : ''}}>{{$category->name}}</option>
			         @endforeach
			      </select>
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 
			 <div class="am-form-group">
			    <label for="quantity" class="am-u-sm-2 am-form-label">商品数量</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="quantity" name="quantity" placeholder="输入商品数量" value="{{$product->quantity}}"
			      	data-rules="required|integer" class="validate" data-display="商品数量">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 <div class="am-form-group">
			    <label for="price" class="am-u-sm-2 am-form-label">商品价格</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="price" name="price" placeholder="输入商品价格" value="{{$product->price}}"
			      	data-rules="required|decimal" class="validate" data-display="商品价格">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 
			 <div class="am-form-group">
			    <label for="discount_price" class="am-u-sm-2 am-form-label">商品折扣价</label>
			    <div class="am-u-sm-5">
			      <input type="text" id="discount_price" name="discount_price" placeholder="输入商品折扣价" value="{{$product->discount_price}}"
			      	data-rules="decimal" class="validate" data-display="商品折扣价">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			  <div class="am-form-group">
			    <label for="doc-ipt-pwd-2" class="am-u-sm-2 am-form-label">运费模式</label>
			    <div class="am-u-sm-5">
			      <select name="postage_mode">
			        <option value="1">默认</option>
			        <option value="2">免邮</option>
			      </select>
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			  </div>
			 <div class="am-form-group">
			    <label for="image" class="am-u-sm-2 am-form-label">修改小图</label>
			    <div class="am-u-sm-5">
			      <input type="file" id="image" name="image" data-display="商品小图">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 <div class="am-form-group">
			    <label for="image" class="am-u-sm-2 am-form-label">商品小图</label>
			    <div class="am-u-sm-5">
			      、		<img alt="" src="{{Images::url($product->image,235,180)}}">
			    </div>
			    <p class="am-u-sm-5 help-block"></p>
			 </div>
			 <div class="am-form-group">
			    <div class="am-u-sm-10 am-u-sm-offset-2">
			      <button type="submit" class="am-btn am-btn-primary" id="product-base-add">保存</button>
			    </div>
			  </div>
			   <div class="am-form-group">
			  <p class="am-text-danger error-msg am-u-sm-10 am-u-sm-offset-2">
			  </p>
			  </div>
			  <input type="hidden" name="id" value="{{$product->id}}"/>
		</form>
      </div>
      <!-- base end -->
      
      <!-- desc start  -->
      <div class="am-tab-panel" id="tab2">
        <form class="am-form am-form-horizontal"  id="productExtForm" name="productExtForm" method="post" 
        	action="{{URL::route('product.ext.add')}}">
          
		<div class="am-form-group">
		    <label for="content" class="am-u-sm-2 am-form-label">商品描述</label>
		    <div class="am-u-sm-5">
		      <textarea id="content" name="content" placeholder="输入商品描述"
		      	data-rules="required" class="validate" data-display="商品描述">{{!empty($product->ext) ? $product->ext->content : '' }}</textarea>
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		    <label for="maintain" class="am-u-sm-2 am-form-label">商品保养</label>
		    <div class="am-u-sm-5">
		      <textarea id="maintain" name="maintain" placeholder="输入商品保养">{{!empty($product->ext) ? $product->ext->maintain : '' }}</textarea>
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		    <label for="returns" class="am-u-sm-2 am-form-label">寄送与退货</label>
		    <div class="am-u-sm-5">
		      <textarea id="returns" name="returns" placeholder="输入寄送与退货">{{!empty($product->ext) ? $product->ext->returns : '' }}</textarea>
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		    <label for="seo_title" class="am-u-sm-2 am-form-label">SEO标题</label>
		    <div class="am-u-sm-5">
		       <input type="text" id="seo_title" name="seo_title" placeholder="输入SEO标题"
		       		value="{{!empty($product->ext) ? $product->ext->seo_title : '' }}"
			      	data-rules="max_length[64]" class="validate" data-display="SEO标题">
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		  <label for="seo_keywords" class="am-u-sm-2 am-form-label">SEO Keywords</label>
		    <div class="am-u-sm-5">
		       <input type="text" id="seo_keywords" name="seo_keywords" placeholder="输入SEO Keywords,用逗号分隔"
			      	value="{{!empty($product->ext) ? $product->ext->seo_keywords : '' }}"
			      	data-rules="max_length[128]" class="validate" data-display="SEO Keywords">
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		    <label for="seo_desc" class="am-u-sm-2 am-form-label">SEO Description</label>
		    <div class="am-u-sm-5">
		      <textarea id="seo_desc" name="seo_desc" placeholder="输入SEO Description"
		      	data-rules="max_length[256]" class="validate" data-display="SEO Description"></textarea>
		    </div>
		    <p class="am-u-sm-5 help-block"></p>
		 </div>
		 <div class="am-form-group">
		    <div class="am-u-sm-10 am-u-sm-offset-2">
		      <button type="submit" class="am-btn am-btn-primary" id="product-ext-add">保存</button>
		    </div>
		  </div>
		  <input type="hidden" name="product_id" value="{{$product->id}}"/>
		  @if (!empty($product->ext))
		  <input name="id" value="{{$product->ext->id}}" type="hidden"/>
		  @endif
        </form>
      </div>
	   <!-- desc start  -->
	  
	  <!-- image start -->
      <div class="am-tab-panel" id="tab3">
      	<div class="am-g am-u-md-12">
    		<div class="am-btn-toolbar">
	            <div class="am-btn-group am-btn-group-xs">
	              <button type="button" class="am-btn am-btn-primary" data-am-modal="{target: '#add-image-dailog'}">
	              	<span class="am-icon-plus"></span>添加
	              </button>
	            </div>
	         </div>
	         
	         <table class="am-table am-table-striped am-table-hover table-main" id="product-images">
	            <thead>
	              <tr>
	                <th width="60">顺序</th>
	                <th>图片</th>
	                <th>操作</th>
	              </tr>
	          </thead>
	          <tbody>
	          @foreach ($product->images as $image)
	            <tr data-id="{{$image->id}}">
	              <td class="m-product-sort">
	              	<a class="swap am-btn am-btn-default am-btn-xs  am-icon-caret-up" data-type="up" data-am-loading="{loadingText: ''}">
	              	</a>
	              	<a class="swap am-icon-caret-down am-btn-xs am-btn am-btn-default" data-type="down" data-am-loading="{loadingText: ''}"></a>
	              </td>
	              <td><img src="{{Images::url($image->image,72,72)}}"></td>
	              <td>
	                <div class="am-btn-toolbar">
	                  <div class="am-btn-group am-btn-group-xs">
	                    <button class="am-btn am-btn-default am-btn-xs am-text-danger m-image-close"
	                    	data-am-loading="{loadingText: '删除中...'}"><span class="am-icon-trash-o"></span> 删除
	                    </button>
	                  </div>
	                </div>
	              </td>
	            </tr>
	            @endforeach
	          </tbody>
	        </table>
    	</div>
       </div>
       <!-- image end -->
       
       <!-- size start -->
      <div class="am-tab-panel" id="tab4">
        <div class="am-g am-u-md-12">
    		<div class="am-btn-toolbar">
	            <div class="am-btn-group am-btn-group-xs">
	              <button type="button" class="am-btn am-btn-primary" data-am-modal="{target: '#add-size-dialog'}">
	              	<span class="am-icon-plus"></span>添加
	              </button>
	            </div>
	         </div>
	         <ul id="product-sizes" class="am-thumbnails am-avg-md-4 am-margin-top" >
	         @if(!empty($product->sizes))
			  @foreach ($product->sizes as $size)
			    <li data-id="{{$size->id}}" data-product_id="{{$product->id}}" data-size="{{$size->size}}" data-quantity="{{$size->quantity}}">
			    	<span data-key>{{$size->size}}</span> / <span data-value>{{$size->quantity}}</span> <i class="am-icon-edit edit-btn"></i>
			  	</li>
			  @endforeach
			 @endif
			</ul>
    	</div>
      </div>
       <!-- size end -->
       
      <!-- color start -->
      <div class="am-tab-panel" id="tab5">
        <div class="am-g am-u-md-12">
    		<div class="am-btn-toolbar">
	            <div class="am-btn-group am-btn-group-xs">
	              <button type="button" class="am-btn am-btn-primary" data-am-modal="{target: '#add-color-dialog'}">
	              	<span class="am-icon-plus"></span>添加
	              </button>
	            </div>
	         </div>
	         <ul id="product-colors" class="am-thumbnails am-avg-md-4 am-margin-top" >
	         @if(!empty($product->colors))
			  @foreach ($product->colors as $color)
			    <li data-id="{{$color->id}}" data-product_id="{{$product->id}}" data-color="{{$color->color}}" data-quantity="{{$color->quantity}}">
			    	<span data-key>{{$color->color}}</span> / <span data-value>{{$color->quantity}}</span> <i class="am-icon-edit edit-btn"></i>
			  	</li>
			  @endforeach
			 @endif
			</ul>
    	</div>
      </div>
       <!-- color end -->
    </div>
  </div>
<!-- tab end -->
  <div class="am-margin">
    <a class="am-btn am-btn-primary am-btn-xs" href="{{URL::route('product.add.show')}}">添加下一个商品</a>
  </div>
  
<!-- 添加图片 start -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="add-image-dailog">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">添加图片
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      	<form class="am-form" id="add-image-form" method="post" enctype="multipart/form-data" 
      		action="{{URL::route('product.image.add')}}">
		      <fieldset class="am-form-set">
		        <input type="file" placeholder="选择一张图片" name="image">
		        <input name="product_id" type="hidden" value="{{$product->id}}"/>
		      </fieldset>
		      <p class="am-text-danger error-msg">
			  </p>
		      <button id="add-image-btn" class="am-btn am-btn-primary am-btn-block submit-btn"  data-am-loading="{spinner: 'circle-o-notch', loadingText: '保存中...', resetText: '添加'}">添加</button>
		</form>
    </div>
  </div>
</div>
<!-- 添加图片结束 -->

<!-- 添加尺寸start -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="add-size-dialog">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">添加尺寸
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      	<form class="am-form" id="add-size-form" method="post" action="{{URL::route('product.size.add')}}"
      		enctype="application/x-www-form-urlencoded">
		      <fieldset class="am-form-set">
		        <input type="text" name="size" id="size" placeholder="输入尺寸"/>
		        <input type="text" name="quantity" id="quantity" placeholder="输入数量"/>
		        <input name="product_id" type="hidden" value="{{$product->id}}"/>
		      </fieldset>
		      <p class="am-text-danger error-msg">
			  </p>
		      <button id="add-size-btn" class="am-btn am-btn-primary am-btn-block submit-btn"  data-am-loading="{spinner: 'circle-o-notch', loadingText: '保存中...', resetText: '添加'}">添加</button>
		</form>
    </div>
  </div>
</div>
<!-- 添加尺寸结束 -->

<!-- 修改尺寸start -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="update-size-dialog">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">添加尺寸
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      	<form class="am-form" id="update-size-form" method="post" action="{{URL::route('product.size.update')}}"
      		enctype="application/x-www-form-urlencoded">
		      <fieldset class="am-form-set">
		        <input type="text" name="size" id="size" placeholder="输入尺寸"/>
		        <input type="text" name="quantity" id="quantity" placeholder="输入数量"/>
		        <input name="id" id="id" type="hidden" value=""/>
		      </fieldset>
		      <p class="am-text-danger error-msg">
			  </p>
		      <button id="update-size-btn" class="am-btn am-btn-primary am-btn-block submit-btn"  data-am-loading="{spinner: 'circle-o-notch', loadingText: '保存中...', resetText: '添加'}">修改</button>
		</form>
    </div>
  </div>
</div>
<!-- 修改尺寸结束 -->

<!-- 添加颜色start -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="add-color-dialog">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">添加颜色
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      	<form class="am-form" id="add-color-form" method="post" action="{{URL::route('product.color.add')}}"
      		enctype="application/x-www-form-urlencoded">
		      <fieldset class="am-form-set">
		        <input type="text" name="color" id="color" placeholder="输入颜色"/>
		        <input type="text" name="quantity" id="quantity" placeholder="输入数量"/>
		        <input name="product_id" type="hidden" value="{{$product->id}}"/>
		      </fieldset>
		      <p class="am-text-danger error-msg">
			  </p>
		      <button id="add-color-btn" class="am-btn am-btn-primary am-btn-block submit-btn"  data-am-loading="{spinner: 'circle-o-notch', loadingText: '保存中...', resetText: '添加'}">添加</button>
		</form>
    </div>
  </div>
</div>
<!-- 添加颜色结束 -->

<!-- 修改颜色start -->
<div class="am-modal am-modal-no-btn" tabindex="-1" id="update-color-dialog">
  <div class="am-modal-dialog">
    <div class="am-modal-hd">添加颜色
      <a href="javascript: void(0)" class="am-close am-close-spin" data-am-modal-close>&times;</a>
    </div>
    <div class="am-modal-bd">
      	<form class="am-form" id="update-color-form" method="post" action="{{URL::route('product.color.update')}}"
      		enctype="application/x-www-form-urlencoded">
		      <fieldset class="am-form-set">
		        <input type="text" name="color" id="color" placeholder="输入颜色"/>
		        <input type="text" name="quantity" id="quantity" placeholder="输入数量"/>
		        <input name="id" id="id" type="hidden" value=""/>
		      </fieldset>
		      <p class="am-text-danger error-msg">
			  </p>
		      <button id="update-color-btn" class="am-btn am-btn-primary am-btn-block submit-btn"  data-am-loading="{spinner: 'circle-o-notch', loadingText: '保存中...', resetText: '添加'}">修改</button>
		</form>
    </div>
  </div>
</div>
<!-- 修改颜色结束 -->
@stop


@section('script')
<script id="image-tpl" type="text/x-handlebars-template">
<tr data-id="@{{id}}">
	<td class="m-product-sort">
	   <a class="swap am-btn am-btn-default am-btn-xs  am-icon-caret-up" data-type="up" data-am-loading="{loadingText: ''}">
	   </a>
	   <a class="swap am-icon-caret-down am-btn-xs am-btn am-btn-default" data-type="down" data-am-loading="{loadingText: ''}"></a>
	</td>
	<td><img src="@{{imgurl image 72 72}}"></td>
	<td>
	   <div class="am-btn-toolbar">
	       <div class="am-btn-group am-btn-group-xs">
	           <button class="am-btn am-btn-default am-btn-xs am-text-danger m-image-close"
	              data-am-loading="{loadingText: '删除中...'}"><span class="am-icon-trash-o"></span> 删除
	           </button>
	       </div>
	   </div>
	</td>
</tr>            
</script>
<script id="size-tpl" type="text/x-handlebars-template">
<li data-id="@{{id}}" data-product_id="@{{product_id}}" data-size="@{{size}}" data-quantity="@{{quantity}}">
	<span data-key>@{{size}}</span> / <span data-value>@{{quantity}}</span> <i class="am-icon-edit edit-btn"></i>
</li>
</script>
<script id="color-tpl" type="text/x-handlebars-template">
<li data-id="@{{id}}" data-product_id="@{{product_id}}" data-color="@{{color}}" data-quantity="@{{quantity}}">
	<span data-key>@{{color}}</span> / <span data-valuey>@{{quantity}}</span> <i class="am-icon-edit edit-btn"></i>
</li>
</script>

{{ HTML::script('assets/js/ueditor/ueditor.config.js') }}
{{ HTML::script('assets/js/ueditor/ueditor.all.min.js') }}
<!--建议手动加在语言，避免在ie下有时因为加载语言失败导致编辑器加载失败-->
<!--这里加载的语言文件会覆盖你在配置项目里添加的语言类型，比如你在配置项目里配置的是英文，这里加载的中文，那最后就是中文-->
{{ HTML::script('assets/js/ueditor/lang/zh-cn/zh-cn.js') }}
<script type="text/javascript">
$(function () {
	function nextTab(){
		$nextTab = $('#product-tab').find(".am-tabs-nav").find(".am-active").next().find("a");
		$('#product-tab').data("amui.tabs").open($nextTab);
	}
	$("#productBaseForm").validate(null,function(){
		$("#product-base-add").button('loading');
		var options = {
	            clearForm:false,
	            success: function (data) {
	            	$("#product-base-add").button('reset');
		            //成功
		            if (data.success){
		            	$(".error-msg").text('');
		            	nextTab();
		            } else {
						$(".error-msg").text('保存错误');
			        }
	            }
	    };
	    //直接提交
	    $("#productBaseForm").ajaxSubmit(options);
		return false;
	});

	var editorOptions = {
			serverUrl : "{{URL::route('ueditor')}}",
		    initialFrameHeight : 320,
		    pasteplain:true,
		    enterTag:'br',
			toolbars: [
		           ['fullscreen', 'source', 'undo', 'redo', 'bold','italic','link','insertunorderedlist',/*'drafts' 从草稿箱加载*/]
		    ],
	};
	var ue = UE.getEditor('content',editorOptions);
	var ue = UE.getEditor('maintain',editorOptions);
	var ue = UE.getEditor('returns',editorOptions);
	//初始化产品基础信息
	//$('#content,#maintain,#returns').wysiwyg(editorOptions);

	$("#productExtForm").validate(null,function(){
		$("#product-ext-add").button('loading');
		var options = {
	            clearForm:false,
	            success: function (data) {
	            	$("#product-ext-add").button('reset');
		            //成功
		            if (data.success){
		            	$(".error-msg").text('');
		            	if ($("#productExtForm").find("[name='id']").length == 0){
		            		$("#productExtForm").append("<input type='hidden' name='id' value='"+data.id+"'/>");
			            }
		            	nextTab();
		            } else {
						$(".error-msg").text('保存错误');
			        }
	            }
	    };
	    //直接提交
	    $("#productExtForm").ajaxSubmit(options);
		return false;
	});

	function renderItem($items,templateId,data){
		var template = Handlebars.compile($("#"+templateId).html());
		$items.append(template(data));
	}

	function buildAddItemAction($list,templateId,before){
		return function (){
			var $btn = $(this);
			$btn.button('loading');
			$dialog = $btn.closest(".am-modal");
			var options = {
					beforeSubmit:before,
		            clearForm:true,
		            success: function (data) {
		            	$btn.button('reset');
			            //成功
			            if (data.success){
			            	$dialog.modal('close');
			            	$dialog.find(".error-msg").text('');
			            	renderItem($list,templateId,data)
			            } else {
			            	$dialog.find(".error-msg").text(data.error);
				        }
		            }
		    };
			$btn.closest("form").ajaxForm(options);
		};
	}
	//图片添加
	$("#add-image-btn").click(buildAddItemAction($('#product-images').find("tbody"),"image-tpl",$.noop));

	function validateSizeAndColor($input){
		var value = $input.val();
		var $form = $input.closest("form");
		var $quantity = $form.find("#quantity");
		var $error = $form.find(".error-msg");
		var $submit = $form.find(".submit-btn");
		var quantity = $quantity.val();
		if (value == null || value == ''){
			$error.text("请输入值");
			$submit.button('reset');
			return false;
		}
		if (value.length > 32){
			$error.text("最多输入32个字符");
			$submit.button('reset');
			return false;
		}

		if (!$.isNumeric(quantity)){
			$error.text("数量必须是数字");
			$submit.button('reset');
			return false;
		}
	}
	//尺寸添加
	$("#add-size-btn").click(buildAddItemAction($('#product-sizes'),"size-tpl",function(){
		//验证尺寸是否填写，并且验证长度
// 		return validateSizeAndColor($("#size"));
		return validateSizeAndColor($("#add-size-dialog").find("#size"));
	}));
	//颜色添加
	$("#add-color-btn").click(buildAddItemAction($('#product-colors'),"color-tpl",function(){
		//验证颜色是否填写，并且验证长度
// 		return validateSizeAndColor($("#color"));
		return validateSizeAndColor($("#add-color-dialog").find("#color"));
	}));

	function deleteItem(url,$this){
		var $i = $this.closest("tr");
		$.post(url,$i.data(),function(data){
			if (data.success){
				$i.remove();
			}
		});
	}

	$("#product-images").on("click",".m-image-close",function(){
		deleteItem("{{URL::route('product.image.delete')}}",$(this));
		var $i = $this.closest("tr");
		$.post("{{URL::route('product.image.delete')}}",$i.data(),function(data){
			if (data.success){
				$i.remove();
			}
		});
	});

	/*
		修改弹出框
	*/
	$(document).on("click",".edit-btn",function(){
		var $source = $(this).closest("li");
		if ($source.data()['size']){
			$('#update-size-dialog').modal({relatedTarget:$source});
		} else {
			$('#update-color-dialog').modal({relatedTarget:$source});
		}
	});
	$("#update-color-dialog,#update-size-dialog").on("open.modal.amui",function(e){
		var $dialog = $(e.currentTarget);
		var $source = $(e.relatedTarget);
		var data = $source.data();
		if (data['size']){
			$dialog.find("#size").val(data['size']);
		} else {
			$dialog.find("#color").val(data['color']);
		}
		$dialog.find("#quantity").val(data['quantity']);
		$dialog.find("#id").val(data['id']);
		//alert("test");
	});

	function buildUpdateAction(success,before){
		return function (){
			var $btn = $(this);
			$btn.button('loading');
			$dialog = $btn.closest(".am-modal");
			var options = {
					beforeSubmit:before,
		            clearForm:true,
		            success: function (data) {
		            	$btn.button('reset');
			            //成功
			            if (data.success){
			            	$dialog.modal('close');
			            	success(data)
			            } else {
			            	$dialog.find(".error-msg").text(data.error);
				        }
		            }
		    };
			$btn.closest("form").ajaxForm(options);
		};
	}

	//尺寸修改
	$("#update-size-btn").click(buildUpdateAction(function(data){	
		$source = $("#update-size-dialog").data("amui.modal").relatedTarget;
		$source.data('quantity',data[quantity]);
		$source.find("[data-key]").text(data["size"]);
		$source.find("[data-value]").text(data["quantity"]);
	},function(){
		//验证尺寸是否填写，并且验证长度
		return validateSizeAndColor($("#update-size-dialog").find("#size"));
	}));
	//颜色修改
	$("#update-color-btn").click(buildUpdateAction(function(data){
		$source = $("#update-color-dialog").data("amui.modal").relatedTarget;
		$source.data('quantity',data[quantity]);
		$source.find("[data-key]").text(data["color"]);
		$source.find("[data-value]").text(data["quantity"]);
	},function(){
		//验证颜色是否填写，并且验证长度
		return validateSizeAndColor($("#update-color-dialog").find("#color"));
	}));


	$(".swap").on("click",function(){
		var $btn = $(this);
		var $tr = $(this).closest("tr");
		var data = {"id1":$tr.data("id")};
		
		var type = $btn.data("type");
		var $tr2 = type == 'up' ? $tr.prev() : $tr.next();
		if ($tr2.length == 0){
			return;
		}
		data.id2 = $tr2.data("id");
		$btn.button("loading");
		$.post("{{URL::route('product.image.swap')}}",data,function(data){
	       	  $btn.button('reset');
	  		  if (data.success){
		  		 if (type == 'up'){
			  			$tr.after($tr2);
			  	 } else {
				  		$tr.before($tr2);
				 }
	  		  } else {
		  		alert("错误");
			  }
		});
	});

});
</script>
@stop
